<template>
	<view>
		<view class="topBg">
			<image class="bg" src='../../static/index/top.png' mode="widthFix"></image>
			<view class="select">
				<image src="../../static/index/Ellipse 35.png"></image>
				<u-select v-model="showSchool" :list="listSelect" @confirm="confirm"></u-select>
				<u-tag :text="SchoolName" type="error" @click="openSelect()"></u-tag>
				<view class="remark">30栋（宵夜营业至23:00）</view>
			</view>
			<button @click="toSearch()" class="searchBtn">
				<u-icon name="search" color="#FF7967"></u-icon>
			</button>
			<view class="imgs">
				<image class="img" src="../../static/index/takeOut.png" mode="widthFix" @tap.stop="modeSwitch(0)">
				</image>
				<image class="img" style="margin-top: 12rpx;" src="../../static/index/errand.png" mode="widthFix"
				 @click="toErrand"></image>
				<image class="img"style="margin-top: 12rpx;" src="../../static/index/feedback.png" mode="widthFix" @click="toFeedback">
				</image>
			</view>
		</view>


		<view class="container">
			<!-- <view>
				<image src="/static/index/seckill.png" mode="widthFix" style="width: 100%;">
				</image>
			</view> -->


			<!-- 功能分类 -->
			<view class="top" v-if="schoolIndex!=-1">
				<view class="function_box" v-if="schoolIndex==0">
				<view class="function_item" @tap.stop="modeSwitch(0)">
					<image src="../../static/index/meishi.png" mode="widthFix"></image>
					<view class="titile">正餐</view>
				</view>
				<view class="function_item" @tap.stop="modeSwitch(1)">
					<image src="../../static/index/yexiao.png" mode="widthFix"></image>
					<view class="titile">夜宵</view>
				</view>
				<view class="function_item" @tap.stop="modeSwitch(4)">
					<image src="../../static/index/zaocan.png" mode="widthFix"></image>
					<view class="titile">早餐</view>
				</view>
				</view>
				<!-- 正餐时间点------------------------------------------------------------------------- -->
				<view>
					<view class="" v-if="currentModeIndex == 0">
						<view class="tn-flex tn-flex-row-between  " style="margin-left: 15rpx;margin-right: 15rpx;">
							<view class="justify-content-item tn-text-bold tn-text-xl ">
								<text class="tn-icon-title "></text>
								<text class="">正餐点餐时间</text>
							</view>
							<!-- <view class="justify-content-item tn-text-lg">
								<text class="tn-padding-xs">滑动查看更多</text>
								<text class="tn-icon-down"></text>
							</view> -->
						</view>
						<view class="time-set">
							<scroll-view scroll-x="true">
								<view style="display: flex;flex-direction: row;">
									<view class="time-set-item"
										v-for="(item, index) in listSelect[schoolIndex].timelist" :key="index">
										<view class="itme-top">{{ item.starttime }}</view>
										<view class="itme-blow">{{ item.endtime }}</view>
									</view>
								</view>
							</scroll-view>
						</view>
					</view>

					<view class="" v-if="currentModeIndex == 1">
						<view class="tn-flex tn-flex-row-between  " style="margin-left: 15rpx;margin-right: 15rpx;">
							<view class="justify-content-item tn-text-bold tn-text-xl ">
								<text class="tn-icon-title "></text>
								<text class="">夜宵点餐时间</text>
							</view>
						</view>
						<view class="time-set">
							<scroll-view scroll-x="true">
								<view class="time-set-item">
									<view class="itme-top">22:20~22:45</view>
									<view class="itme-blow">21:40关闭</view>
								</view>
							</scroll-view>
						</view>
					</view>
					<view class="" v-if="currentModeIndex == 4">
						<view class="tn-flex tn-flex-row-between  " style="margin-left: 15rpx;margin-right: 15rpx;">
							<view class="justify-content-item tn-text-bold tn-text-xl ">
								<text class="tn-icon-title "></text>
								<text class="">早餐点餐时间</text>
							</view>
						</view>
						<view class="time-set">
							<scroll-view scroll-x="true">
								<view class="time-set-item">
									<view class="itme-top">7:00~7:20</view>
									<view class="itme-blow">凌晨2:00关闭</view>
								</view>
							</scroll-view>
						</view>
					</view>
				</view>

				<!--赔付说明--------------------------------------------------------------------------- -->
				<view class="margin-top-sm" style="display: flex;margin-left: 20rpx"
					v-if="listSelect[schoolIndex].rule">
					<image src="/static/notice.png" style="width: 36rpx;height: 36rpx;"></image>
					<view class="text-black text-bold" style="font-size: 24rpx; margin-left: 8rpx;"
						@click="toShowRule()">点击查看超时赔付规则</view>
				</view>
				<view v-if="rule_show" class="rule margin-top-xs bg-white">
					<view class="text-xs text-black margin-left-sm margin-top-xs text-bold"
						style="letter-spacing: 2rpx;">食小助平台超时赔付规则如下：</view>
					<view class="text-xs text-black margin-left-sm margin-top-xs" style="letter-spacing: 2rpx;">①
						超过送达区间5分钟以上赔付问题餐支付价格的10%</view>
					<view class="text-xs text-black margin-left-sm" style="letter-spacing: 2rpx;">②
						超过送达区间10分钟以上赔付问题餐支付价格的20%</view>
					<view class="text-xs text-black margin-left-sm" style="letter-spacing: 2rpx;">③
						超过送达区间20分钟以上赔付问题餐支付价格的30%</view>
					<view class="text-xs text-black margin-left-sm" style="letter-spacing: 2rpx;">④
						超过送达区间30分钟以上赔付问题餐支付价格的50%</view>
					<view class="text-xs text-red margin-left-sm margin-bottom-xs" style="letter-spacing: 2rpx;">
						PS: 赔付请添加在楼栋群中添加楼栋负责人凭订单截图并且说明情况领取【一般是群管理】
					</view>
				</view>
			</view>

			<!-- 商家分类-------------------------------------------------------------------------------------------- -->
			<!-- 分类设置 &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&-->
			<view class="navTag" v-if="schoolIndex!=-1&&currentModeIndex == 0">
				<scroll-view scroll-x="true">
					<view style="display: flex;flex-direction: row;">
						<view class="navTags" v-for="item in navTag" @click="changeTag(item.value)" :key="item.id">
							<!-- <view class="navTag-text" :style="item.value === currentTag ? 'color:' + item.color : 'color:#ABABAB'">{{ item.text }}</view>
					<view class="navTag-select text-bold" :style="item.value === currentTag ? 'background:' + item.color : 'background:#00000033'"></view> -->
							<view :class="item.value === currentTag ? 'checked' :''"
								style="padding: 10rpx 14rpx 10rpx 14rpx ;">{{item.text}}</view>
						</view>
					</view>
				</scroll-view>
			</view>

			<!-- 商家门店 %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%-->
			<view class="store-box" v-if="currentModeIndex === 0">
				<view class="item-box" v-for="(store, i) in storeList" :key="i"
					@click="toStore(store.data.store_id, store.data.isstart, store.data.delivery, 1)"
					v-if="store.data.isstart && store.data.isban">
					<view class="top-box">
						<view class="left">
							<image :src="store.data.avatar" mode="aspectFill"></image>
							<view>可用优惠</view>
						</view>
						<view class="right">
							<view style="display: flex;align-items: center;">
								<text class="tit margin-right-sm"
									style="margin-left: 2rpx;">{{ store.data.name }}</text>
								<view v-if="store.data.type == 0"></view>
								<!-- <view v-if="store.data.type == 1" class="mark-tag bg-gradual-orange text-white">人气</view> -->
								<view v-if="store.data.type == 2" class="mark-tag bg-gradual-orange text-white">上新
								</view>
								<view v-if="store.data.type == 3" class="mark-tag bg-gradual-orange text-white">促销
								</view>
								<!-- <view v-if="store.data.delivery == 3" class="mark-tag bg-gradual-orange text-white" style="margin-left: 20rpx;">免上楼费</view> -->

								<!-- <view v-if="store.data.delivery != 3" class="mark-tag bg-grey text-white" style="margin-left: 20rpx;color: #FFFFFF;">配送上楼1.0</view> -->
							</view>
							<view class="row justify-content">
								<view class="row-left" style="display: flex; align-items: center;">
									<!-- <i class="hxicon-locationfill" style="margin-top: 2rpx;"></i> -->
									<text v-if="store.data.address">{{ store.data.address }}</text>
									<text v-if="store.data.starting_price">起送￥{{ store.data.starting_price }}</text>
									<!-- <text class="t2">月售{{store.data.monthly_sales}}</text> -->
								</view>
							</view>
							<view class="row rowTags">

								<view class="t2" v-if="store.data.delivery != 3">配送上楼￥1.0</view>
								<view class="t2" v-else>免费配送上楼</view>
								<view v-if="store.data.isNew">新客立减{{store.data.newMoney}}元</view>
							</view>
						</view>
					</view>
					<view class="bottom-box" v-if="store.data.newgoods">
						<view class="bottom-box-container" style="display: flex; flex-direction: column;">
							<scroll-view scroll-x="true">
								<view class="goods-box" v-for="(goods, j) in store.data.newgoods" :key="j">
									<view class="img-box">
										<image :src="goods.main_pic" mode="aspectFill">
											<view class="tit">{{ goods.name }}</view>
										</image>
									</view>

									<view class="price-box">
										<text class="txt1">￥</text>
										<text class="txt2">{{ goods.price }}</text>
										<text class="txt3">￥{{ goods.oldprice }}</text>
									</view>
								</view>
							</scroll-view>
						</view>
					</view>
				</view>
			</view>

			<!-- //宵夜###################################################################### -->
			<view class="store-box" v-if="currentModeIndex === 1">
				<!-- 店铺列表 -->
				<view class="item-box" v-for="(store, i) in storenightList" :key="i"
					@click="toStore(store.data.store_id, store.data.isstart, store.data.delivery, 2)"
					v-if="store.data.isstart && store.data.isban">
					<view class="top-box">
						<view class="left">
							<image :src="store.data.avatar" mode="aspectFill"></image>
						</view>
						<view class="right">
							<view style="display: flex;align-items: center;">
								<text class="tit margin-right-sm"
									style="margin-left: 2rpx;">{{ store.data.name }}</text>
								<view v-if="store.data.type == 0"></view>
								<view v-if="store.data.type == 1" class="mark-tag bg-gradual-orange text-white">人气
								</view>
								<view v-if="store.data.type == 2" class="mark-tag bg-gradual-orange text-white">上新
								</view>
								<view v-if="store.data.type == 3" class="mark-tag bg-gradual-orange text-white">促销
								</view>
								<view v-if="store.data.delivery == 3" class="mark-tag bg-gradual-orange text-white"
									style="margin-left: 20rpx;">免上楼费</view>
								<!-- <view v-if="store.data.delivery != 3" class="mark-tag bg-grey text-white" style="margin-left: 20rpx;color: #FFFFFF;">配送上楼1.0</view> -->
							</view>

							<view class="row justify-content">
								<view class="row-left" style="display: flex; align-items: center;">
									<i class="hxicon-locationfill" style="margin-top: 2rpx;"></i>
									<text class="margin-left-xs">{{ store.data.address }}</text>
									<!-- <text class="t2">月售{{store.data.monthly_sales}}</text> -->
								</view>
							</view>
							<view class="row">
								<text>起送￥{{ store.data.starting_price }}</text>
								<text class="t2" v-if="store.data.delivery != 3">配送上楼￥1.0</text>
								<text class="t2" v-else>免费配送上楼</text>
							</view>
							<!-- <view class="row">
							<view style="display: flex;">
								<view v-if="store.data.activity" v-for="(item,index) in store.data.activity" class="mark-tag" style="display: flex;border: 3rpx solid #FF5C26;" :key="index">{{item.tag}}</view>
							</view>
						</view> -->
						</view>
					</view>
					<view class="bottom-box" v-if="store.data.newgoods">
						<view class="bottom-box-container" style="display: flex; flex-direction: column;">
							<scroll-view scroll-x="true">
								<view class="goods-box" v-for="(goods, j) in store.data.newgoods" :key="j">
									<view class="img-box">
										<image :src="goods.main_pic" mode="aspectFill"></image>
										<!-- <view class="tag">{{ goods.tag }}</view> -->
										<!-- <view class="tag">特价</view> -->
									</view>
									<view class="tit">{{ goods.name }}</view>
									<view class="price-box">
										<text class="txt1">￥</text>
										<text class="txt2">{{ goods.price }}</text>
										<text class="txt3">￥{{ goods.oldprice }}</text>
									</view>
								</view>
							</scroll-view>
						</view>
					</view>
				</view>
			</view>

			<!-- 快递############################################################################# -->
			<view class="store-box" v-if="currentModeIndex === 2">
				<!-- 店铺列表 -->
				<view class="item-box" v-for="(store, i) in storedeliveryList" :key="i"
					@click="toStore(store.data.store_id, store.data.isstart, store.data.delivery, 4)"
					v-if="store.data.isstart && store.data.isban">
					<view class="top-box">
						<view class="left">
							<image :src="store.data.avatar" mode="aspectFill"></image>
						</view>
						<view class="right">
							<view style="display: flex;align-items: center;">
								<text class="tit margin-right-sm"
									style="margin-left: 2rpx;">{{ store.data.name }}</text>
								<view v-if="store.data.type == 0"></view>
								<view v-if="store.data.type == 1" class="mark-tag bg-gradual-orange text-white">人气
								</view>
								<view v-if="store.data.type == 2" class="mark-tag bg-gradual-orange text-white">上新
								</view>
								<view v-if="store.data.type == 3" class="mark-tag bg-gradual-orange text-white">促销
								</view>
								<view v-if="store.data.delivery == 3" class="mark-tag bg-gradual-orange text-white"
									style="margin-left: 20rpx;">免上楼费</view>
								<!-- <view v-if="store.data.delivery != 3" class="mark-tag bg-grey text-white" style="margin-left: 20rpx;color: #FFFFFF;">配送上楼1.0</view> -->
							</view>

							<view class="row justify-content">
								<view class="row-left" style="display: flex; align-items: center;">
									<i class="hxicon-locationfill" style="margin-top: 2rpx;"></i>
									<text class="margin-left-xs">{{ store.data.address }}</text>
									<!-- <text class="t2">月售{{store.data.monthly_sales}}</text> -->
								</view>
							</view>
							<view class="row">
								<text>起送￥{{ store.data.starting_price }}</text>
								<text class="t2" v-if="store.data.delivery != 3">配送上楼￥1.0</text>
								<text class="t2" v-else>免费配送上楼</text>
							</view>
							<!-- <view class="row">
							<view style="display: flex;">
								<view v-if="store.data.activity" v-for="(item,index) in store.data.activity" class="mark-tag" style="display: flex;border: 3rpx solid #FF5C26;" :key="index">{{item.tag}}</view>
							</view>
						</view> -->
						</view>
					</view>
					<view class="bottom-box" v-if="store.data.newgoods">
						<view class="bottom-box-container" style="display: flex; flex-direction: column;">
							<scroll-view scroll-x="true">
								<view class="goods-box" v-for="(goods, j) in store.data.newgoods" :key="j">
									<view class="img-box">
										<image :src="goods.main_pic" mode="aspectFill"></image>
										<!-- <view class="tag">{{ goods.tag }}</view> -->
										<!-- <view class="tag">特价</view> -->
									</view>
									<view class="tit">{{ goods.name }}</view>
									<view class="price-box">
										<text class="txt1">￥</text>
										<text class="txt2">{{ goods.price }}</text>
										<text class="txt3">￥{{ goods.oldprice }}</text>
									</view>
								</view>
							</scroll-view>
						</view>
					</view>
				</view>
			</view>

			<!-- //早餐））））））））））））））））））））））））））））））））））））））））））））））））） -->
			<view class="store-box" v-if="currentModeIndex === 4">
				<!-- 店铺列表 -->
				<view class="item-box" v-for="(store, i) in storeMorningList" :key="i"
					@click="toStore(store.data.store_id, store.data.isstart, store.data.delivery, 3)"
					v-if="store.data.isstart && store.data.isban">
					<view class="top-box">
						<view class="left">
							<image :src="store.data.avatar" mode="aspectFill"></image>
						</view>
						<view class="right">
							<view style="display: flex;align-items: center;">
								<text class="tit margin-right-sm"
									style="margin-left: 2rpx;">{{ store.data.name }}</text>
								<view v-if="store.data.type == 0"></view>
								<view v-if="store.data.type == 1" class="mark-tag bg-gradual-orange text-white">人气
								</view>
								<view v-if="store.data.type == 2" class="mark-tag bg-gradual-orange text-white">上新
								</view>
								<view v-if="store.data.type == 3" class="mark-tag bg-gradual-orange text-white">促销
								</view>
								<view v-if="store.data.delivery == 3" class="mark-tag bg-gradual-orange text-white"
									style="margin-left: 20rpx;">免上楼费</view>
								<!-- <view v-if="store.data.delivery != 3" class="mark-tag bg-grey text-white" style="margin-left: 20rpx;color: #FFFFFF;">配送上楼1.0</view> -->
							</view>

							<view class="row justify-content">
								<view class="row-left" style="display: flex; align-items: center;">
									<i class="hxicon-locationfill" style="margin-top: 2rpx;"></i>
									<text class="margin-left-xs">{{ store.data.address }}</text>
									<!-- <text class="t2">月售{{store.data.monthly_sales}}</text> -->
								</view>
							</view>
							<view class="row">
								<text>起送￥{{ store.data.starting_price }}</text>
								<text class="t2" v-if="store.data.delivery != 3">配送上楼￥1.0</text>
								<text class="t2" v-else>免费配送上楼</text>
							</view>
							<!-- <view class="row">
							<view style="display: flex;">
								<view v-if="store.data.activity" v-for="(item,index) in store.data.activity" class="mark-tag" style="display: flex;border: 3rpx solid #FF5C26;" :key="index">{{item.tag}}</view>
							</view>
						</view> -->
						</view>
					</view>
					<view class="bottom-box" v-if="store.data.newgoods">
						<view class="bottom-box-container" style="display: flex; flex-direction: column;">
							<scroll-view scroll-x="true">
								<view class="goods-box" v-for="(goods, j) in store.data.newgoods" :key="j">
									<view class="img-box">
										<image :src="goods.main_pic" mode="aspectFill"></image>
										<!-- <view class="tag">{{ goods.tag }}</view> -->
										<!-- <view class="tag">特价</view> -->
									</view>
									<view class="tit">{{ goods.name }}</view>
									<view class="price-box">
										<text class="txt1">￥</text>
										<text class="txt2">{{ goods.price }}</text>
										<text class="txt3">￥{{ goods.oldprice }}</text>
									</view>
								</view>
							</scroll-view>
						</view>
					</view>
				</view>
			</view>

			<!-- 底部加载栏 -->
			<view class="bottom-more" v-if="schoolIndex!=-1">
				<view class="text-lg text-white">{{ loadmoreStatus }}</view>
				<view class="margin-top-xs" style="width: 80%;height: 2rpx;background-color: #ffffff;"></view>
				<image class="margin-top-xs" src="/static/me/logo.jpg" mode="aspectFill"
					style="border-radius: 50%;width: 60rpx;height: 60rpx;"></image>
				<view>
					经营许可证编号：湘B2-20220167
					网站域名备案：湘ICP备2022001571号-1
				</view>
			</view>
			<!-- 消息提醒 -->
			<u-toast ref="uToast" />
			<!-- //加载动画 -->
		</view>
	</view>
</template>

<script>
	//数据库引入
	const db = uniCloud.database();
	const dbCmd = db.command;
	//引入全局变量
	let app = getApp();
	//引入测试数据
	const screenHeight = uni.getSystemInfoSync().screenHeight;
	export default {
		data() {
			return {
				currentTag: 0,
				SchoolName: '请选择校区',
				listSelect: [{
						value: '0',
						label: '中南大学南校区',
						timelist: [{
								starttime: '11:00~11:20',
								endtime: '最晚10:30关闭'
							}, {
								starttime: '11:20~11:40',
								endtime: '最晚10:50关闭'
							},
							{
								starttime: '11:40~12:00',
								endtime: '最晚11:10关闭'
							},
							{
								starttime: '12:00~12:20',
								endtime: '最晚11:30关闭'
							},
							{
								starttime: '12:20~12:40',
								endtime: '最晚11:50关闭'
							},
							{
								starttime: '12:40~13:00',
								endtime: '最晚12:20关闭'
							},
							{
								starttime: '17:00~17:20',
								endtime: '最晚16:30关闭'
							},
							{
								starttime: '17:20~17:40',
								endtime: '最晚16:50关闭'
							},
							{
								starttime: '17:40~18:00',
								endtime: '最晚17:10关闭'
							},
							{
								starttime: '18:00~18:20',
								endtime: '最晚17:50关闭'
							},
							{
								starttime: '18:20~18:40',
								endtime: '最晚18:10关闭'
							},
							{
								starttime: '18:40~19:00',
								endtime: '最晚18:20关闭'
							},
							{
								starttime: '22:20~22:45',
								endtime: '最晚21:40关闭'
							}
						],
						bannerData: [{
								page: '/pages/huoma/huoma',
								src: '../../static/index/shouye.png'
							},
							{
								page: '/pages/huoma/huoma',
								src: '../../static/index/shouye.png'
							},
							{
								page: '/pages/store/index?sid=16680806912&delivery=1&sign=4',
								src: '../../static/index/kuaidi.png'
							}
						]
					},
					{
						value: '1',
						label: "中南大学本部校区",
						timelist: [{
								starttime: '11:45~12:05',
								endtime: '最晚11:10关闭'
							}, {
								starttime: '12:25~12:45',
								endtime: '最晚11:50关闭'
							},
							{
								starttime: '17:45~18:05',
								endtime: '最晚17:10关闭'
							}, {
								starttime: '18:25~18:45',
								endtime: '最晚17:50关闭'
							},
						],
						bannerData: [{
							page: '/pages/huoma/huoma',
							src: '../../static/index/shouye.png'
						}]
					},
					{
						value: '2',
						label: "湖南大学财经校区",
						timelist: [{
								starttime: '11:05~11:25',
								endtime: '最晚10:30关闭'
							},
							{
								starttime: '11:45~12:05',
								endtime: '最晚11:10关闭'
							}, {
								starttime: '12:25~12:45',
								endtime: '最晚11:50关闭'
							},
							{
								starttime: '17:05~17:25',
								endtime: '最晚16:30关闭'
							},
							{
								starttime: '17:45~18:05',
								endtime: '最晚17:10关闭'
							}, {
								starttime: '18:25~18:45',
								endtime: '最晚17:50关闭'
							},
						],
						bannerData: [{
							page: '/pages/newhuoma/newhuoma?schoolIndex=2',
							src: '../../static/index/hudaindex.png'
						}]
					}
					// ,
					// {
					// 	value:'2',
					// 	label:"湖南大学财经校区"
					// }
				],
				currentTab: 0,
				navTag: [{
						text: '全部',
						value: 0,
						page: 1,
						color: '#76BDFF',
						fulltext: '全部',
						storeList: []
					},
					{
						text: '主食正餐',
						value: 1,
						page: 0,
						color: '#FF69BA',
						fulltext: '主食正餐',
						storeList: []
					},
					{
						text: '粥粉汤面',
						value: 2,
						page: 0,
						color: '#8F8FFF',
						fulltext: '粥粉汤面',
						storeList: []
					},
					{
						text: '汉堡炸鸡',
						value: 3,
						page: 0,
						color: '#FF8282',
						fulltext: '汉堡炸鸡',
						storeList: []
					},
					{
						text: '奶茶果切',
						value: 4,
						page: 0,
						color: '#4DD8A0',
						fulltext: '奶茶果切',
						storeList: []
					},
					{
						text: '西餐料理',
						value: 5,
						page: 0,
						color: '#FFD90C',
						fulltext: '西餐料理',
						storeList: []
					},
					{
						text: '卤味烧烤',
						value: 6,
						page: 0,
						color: '#76BDFF',
						fulltext: '卤味烧烤',
						storeList: []
					},
					{
						text: '小吃零食',
						value: 7,
						page: 0,
						color: '#76BDFF',
						fulltext: '小吃零食',
						storeList: []
					},
					{
						text: '麻辣烫',
						value: 8,
						page: 0,
						color: '#76BDFF',
						fulltext: '麻辣烫冒菜',
						storeList: []
					},
					{
						text: '面包蛋糕',
						value: 9,
						page: 0,
						color: '#76BDFF',
						fulltext: '面包蛋糕',
						storeList: []
					},
					{
						text: '其他',
						value: 10,
						page: 0,
						color: '#76BDFF',
						fulltext: '其他',
						storeList: []
					}
				],
				school: -1,
				showSchool: false,
				keyword: '',
				schoolIndex: -1,
				imgList: [{
						src: '../../static/index/xiaoqu/nan.png',
						title: '南校'
					},
					{
						src: '../../static/index/xiaoqu/ben.png',
						title: '本部'
					}
				],
				page: 0,
				loadmoreStatus: '下拉加载更多', //加载标识
				isdelivery: false,
				storeMorningList: [],
				storedeliveryList: [],
				currentModeIndex: 0,
				specialPrice: [],
				showFoot: 0,
				downOption: {
					auto: false
				},
				rule_show: false,
				head_style: {
					'font-size': '14rpx'
				},

				menuList: [],
				sortIndex: 0,
				storeList: [],
				bannerData: [{
						page: '/pages/huoma/huoma',
						src: '../../static/index/shouye.png'
					},
					{
						page: '/pages/huoma/huoma',
						src: '../../static/index/shouye.png'
					},
					{
						page: '/pages/store/index?sid=16680806912&delivery=1&sign=4',
						src: '../../static/index/kuaidi.png'
					}
				],
				hos_list: [],
				storenightList: [],
				test: false,
				super: false,
				// 模式选中滑块
				modeSliderStyle: {
					left: 0
				}
			};
		},
		onLoad(options) {
			let that = this;
			if(options.type!=undefined&&options.type == 'weixin'){
				console.log("是微信")
				app.globalData.type = 'weixin'
				app.globalData.miniOpenid = options.openid
				console.log("aapp",app.globalData.type)
				uni.showModal({
					title:"是小程序环境",
					success() {
					}
				})
			}
			
			that.super = options.super;
			that.page = 0;
			//加载商家店铺
			// that.getstoreList(0);
			//加载校区
			that.listSelect = []
			db.collection('school').get()
			.then((res)=>{
				for (var i = 0; i < res.result.data.length; i++) {
					var item = {}
					item.label = res.result.data[i].data.schoolName
					item.value = String(res.result.data[i].data.school)
					item.timelist = res.result.data[i].data.timelist
					item.bannerData = res.result.data[i].data.bannerData
					that.listSelect.push(item)
				}
				console.log("学校",that.listSelect[0].value)
			})
			
			
			if(options.school!=undefined){
				//说明有学校,那就用这个学校
				that.schoolIndex = options.school
				that.SchoolName = listSelect[options.school].label
			}else{
				
				uni.getStorage({
					key: 'school_sxz',
					success(res) {
						if (res.data.SchoolName == '请选择校区' || res.data.SchoolName == undefined) {
							uni.showModal({
								title:"温馨提示",
								content:"请选择校区"
							})
							that.schoolIndex = -1
							that.SchoolName = "请选择校区"
						} else {
							that.schoolIndex = res.data.schoolIndex
							that.SchoolName = that.listSelect[that.schoolIndex].label
							that.getstoreList(that.schoolIndex)
						}
					},
					fail(res) {
						uni.showModal({
							title:"温馨提示",
							content:"请选择校区"
						})
						that.schoolIndex = -1
						that.SchoolName = "请选择校区"
					}
				});
			}
		},
		onShow() {
			let that = this;
		},
		watch: {
			currentModeIndex(value) {
				const sliderWidth = uni.upx2px(600 / 2);
				this.modeSliderStyle.left = `${sliderWidth * value}px`;
			}
		},
		// 下拉触底
		onReachBottom() {
			let that = this;
			if (this.schoolIndex == -1) {
				uni.showModal({
					title: "请选择校区"
				})
				return
			}
			if (this.schoolIndex == 1 || this.schoolIndex == 0) {
				var school = 0
			} else if ((this.schoolIndex == 2)) {
				//直接进入请求校区店铺
				var school = 1
			}
			if (that.currentModeIndex == 0) {
				console.log('触底啦！');
				uni.showLoading({
					title: '正在加载店铺'
				});
				if (that.currentTag == 0) {
					console.log('进来啦！');

					//加载商家店铺
					db.collection('storeList')
						.where({
							'data.isban': true,
							'data.school': school
						})
						.orderBy('data.id')
						.skip(that.navTag[that.currentTag].page * 10)
						.limit(10)
						.get({})
						.then(res => {
							uni.hideLoading();
							console.log('商家店铺列表', res);
							if (res.result.data == 0) {
								that.$refs.uToast.show({
									title: '到底啦！',
									type: 'success'
								});
								that.loadmoreStatus = '更多商家敬请期待！';
							} else if (res.result.data < 10) {
								that.navTag[that.currentTag].storeList = that.navTag[that.currentTag].storeList.concat(
									res.result.data);
								that.storeList = that.navTag[that.currentTag].storeList;
								that.navTag[that.currentTag].page = that.navTag[that.currentTag].page + 1;
								that.loadmoreStatus = '更多商家敬请期待！';
							} else {
								that.navTag[that.currentTag].storeList = that.navTag[that.currentTag].storeList.concat(
									res.result.data);
								that.storeList = that.navTag[that.currentTag].storeList;
								that.navTag[that.currentTag].page = that.navTag[that.currentTag].page + 1;
								that.loadmoreStatus = '下拉加载更多！';
							}
						})
						.catch(err => {
							uni.hideLoading();
							that.$refs.uToast.show({
								title: '网络错误！',
								type: 'error'
							});
						});
				} else {
					//加载商家店铺
					db.collection('storeList')
						.where({
							'data.isban': true,
							'data.fenlei': that.navTag[that.currentTag].fulltext,
							'data.school': school
						})
						.orderBy('data.id')
						.skip(that.navTag[that.currentTag].page * 10)
						.limit(10)
						.get({})
						.then(res => {
							uni.hideLoading();
							console.log('商家店铺列表', res);
							if (res.result.data == 0) {
								that.$refs.uToast.show({
									title: '到底啦！',
									type: 'success'
								});
								that.loadmoreStatus = '更多商家敬请期待！';
							} else if (res.result.data < 10) {
								that.navTag[that.currentTag].storeList = that.navTag[that.currentTag].storeList.concat(
									res.result.data);
								that.storeList = that.navTag[that.currentTag].storeList;
								that.navTag[that.currentTag].page = that.navTag[that.currentTag].page + 1;
								that.loadmoreStatus = '更多商家敬请期待！';
							} else {
								that.navTag[that.currentTag].storeList = that.navTag[that.currentTag].storeList.concat(
									res.result.data);
								that.storeList = that.navTag[that.currentTag].storeList;
								that.navTag[that.currentTag].page = that.navTag[that.currentTag].page + 1;
								that.loadmoreStatus = '下拉加载更多！';
							}
						})
						.catch(err => {
							uni.hideLoading();
							that.$refs.uToast.show({
								title: '网络错误！',
								type: 'error'
							});
						});
				}
			} else {
				that.loadmoreStatus = '更多商家敬请期待！';
			}
		},
		methods: {
			//选择完校区后进行数据的更新
			confirm(e) {
				let that = this
				this.schoolIndex = parseInt(e[0].value)
				console.log("选择schoolIndex", this.schoolIndex)
				this.SchoolName = e[0].label
				console.log("hhhhhhhhhh", this.listSelect[this.schoolIndex].bannerData[0])
				// 保证本部的店铺可以，但是请求的时候还是要传进去0
				this.getstoreList(this.schoolIndex)
				app.globalData.schoolIndex = this.schoolIndex
				uni.setStorage({
					key: 'school_sxz',
					data: {
						schoolIndex: that.schoolIndex,
						SchoolName: that.SchoolName
					},
					success(res) {
						uni.showToast({
							title: that.SchoolName
						})
					},
					fail() {

					}
				});
			},
			//%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%【初始化加载商家店铺】%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
			getstoreList(schoolIndex) {
				//下拉刷新商家
				let that = this;
				uni.showLoading({
					title: '加载中'
				});
				if (schoolIndex == 1 || schoolIndex == 0) {
					var school = 0
				} else {
					//直接进入请求校区店铺
					var school = 1
				}
				if (that.currentTag == 0) {
					db.collection('deliverytime')
						.where({
							'data.iskai': true
						})
						.get()
						.then(res => {
							console.log('res次数', res.result.data.length);
							//加载全部商家店铺【按排名】
							db.collection('storeList')
								.where({
									'data.isban': true,
									'data.school': school
								})
								.orderBy('data.id')
								.limit(10)
								.get({})
								.then(res => {
									console.log('商家店铺列表', res);
									that.navTag[that.currentTag].storeList = res.result.data;
									that.storeList = that.navTag[that.currentTag].storeList;
									uni.hideLoading();
								})
								.catch(err => {});
						});
				}
			},
			//%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%【初始化加载商家店铺】%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
			// 切换加载
			getStoreTag(currentTag) {
				//下拉刷新商家
				let that = this;
				if (this.schoolIndex == 1 || this.schoolIndex == 0) {
					var school = 0
				} else {
					//直接进入请求校区店铺
					var school = 1
				}
				if (currentTag == 0) {
					that.storeList = that.navTag[that.currentTag].storeList;
				} else {
					if (that.navTag[that.currentTag].page == 0) {
						uni.showLoading({
							title: '加载中'
						});
						db.collection('deliverytime')
							.where({
								'data.iskai': true
							})
							.get()
							.then(res => {
								console.log('res次数', res.result.data.length);
								//加载全部商家店铺【按排名】
								db.collection('storeList')
									.where({
										'data.isban': true,
										'data.fenlei': that.navTag[that.currentTag].fulltext,
										'data.school': school
									})
									.orderBy('data.id')
									.limit(10)
									.get({})
									.then(res => {
										console.log('商家店铺列表', res);
										that.navTag[that.currentTag].storeList = res.result.data;
										that.storeList = that.navTag[that.currentTag].storeList;
										that.navTag[that.currentTag].page = that.navTag[that.currentTag].page + 1;
										uni.hideLoading();
									})
									.catch(err => {});
							});
					} else {
						//已加载数据
						that.storeList = that.navTag[that.currentTag].storeList;
					}
				}
			},

			//商家分类标签
			changeTag(e) {
				if (this.currentTag == e) {
					return;
				}
				this.currentTag = e;
				this.getStoreTag(this.currentTag);
				this.storeList = this.navTag[this.currentTag].storeList;
				console.log('当前所属标签号：', e);
			},
			// 滚动切换标签样式
			switchTab(event) {
				this.currentTag = event.detail.current;
				console.log('切换导航栏', this.currentTag);
				this.storeList = this.navTag[this.currentTag].storeList;
			},

			openSelect() {
				this.showSchool = true;
			},
			select(index) {
				this.showSchool = false;
				this.schoolIndex = index;
				uni.showToast({
					title: '您已选择' + this.imgList[index].title
				});
			},
			//搜索
			toSearch() {
				if (this.schoolIndex == -1) {
					//需要先选择校区
					uni.showModal({
						title: "温馨提示",
						content: "请先选择校区"
					})
				} else {
					uni.navigateTo({
						url: 'search?schoolIndex=' + this.schoolIndex
					});
				}

			},
			gotoBanner(url) {
				console.log('轮播图跳转', url);
				uni.navigateTo({
					url: url
				});
			},
			modeSwitch(index) {
				if (index == 0) {
					this.loadmoreStatus = '下拉加载更多';
				}
				if (index == 1) {
					this.getnightstore();
					this.loadmoreStatus = '更多商家敬请期待！';
				}
				if (index == 4) {
					this.getmorningstore();
					this.loadmoreStatus = '更多商家敬请期待！';
				}
				if (index == 2) {
					this.getdeliverystore();
					this.loadmoreStatus = '更多商家敬请期待！';
				}
				if (index == 5) {
					this.gotodaiban();
					this.loadmoreStatus = '更多商家敬请期待！';
				}
				if (index == 3) {
					this.loadmoreStatus = '更多商家敬请期待！';
					uni.showModal({
						title: '该功能正在研发中...敬请期待'
					});
					return;
				}
				if (index == 6) {
					uni.navigateTo({
						url: '/pages/goods/goods?id=62f919c905754800015931b7&storeId=16680806922'
					});
					return;
				}
				this.currentModeIndex = index;
				this.showPassword = false;
			},
			gotodaiban() {
				let parameter = `?sid=16680806914` + '&delivery=3' + '&sign=5';
				uni.navigateTo({
					url: '/pages/store/index' + parameter
				});
			},
			//获取早餐店铺
			getmorningstore() {
				let that = this;
				//直接找夜宵店铺
				uni.showLoading({
					title: '加载中。。。'
				});
				db.collection('morningStore')
					.where({
						'data.isban': true
					})
					.orderBy('data.id')
					.get({})
					.then(res => {
						uni.hideLoading();
						that.storeMorningList = res.result.data;
					})
					.catch(err => {});
			},
			//获取快递店铺
			getdeliverystore() {
				let that = this;
				//直接找夜宵店铺
				db.collection('deliveryStore')
					.where({
						'data.isban': true
					})
					.orderBy('data.id')
					.get({})
					.then(res => {
						that.storedeliveryList = res.result.data;
					})
					.catch(err => {});
			},
			//获取夜宵店铺
			getnightstore() {
				let that = this;
				uni.showLoading({
					title: '加载中。。。'
				});
				//直接找夜宵店铺
				db.collection('nightStore')
					.where({
						'data.isban': true
					})
					.orderBy('data.id')
					.get({})
					.then(res => {
						uni.hideLoading();
						that.storenightList = res.result.data;
						console.log('夜宵店铺列表', res);
					})
					.catch(err => {});
			},
			toStore(id, isstart, delivery, sign) {
				let that = this;
				let parameter = `?sid=${id}` + '&delivery=' + delivery + '&sign=' + sign + '&school=' + this.schoolIndex;
				//平台暂不开放
				// if(that.super){

				// }else{
				// 	that.$refs.uToast.show({
				// 		title: '非常抱歉，目前平台定于9月6号早上8点正式开始营业，我们不见不散！',
				// 		type: 'error'
				// 	});
				// 	return
				// }
				if (!isstart) {
					that.$refs.uToast.show({
						title: '该店铺的营业时间已经关闭！',
						type: 'error'
					});
				} else {
					uni.navigateTo({
						url: '/pages/store/index' + parameter
					});
				}
			},
			//查看超时赔付
			toShowRule() {
				if (this.rule_show) {
					this.rule_show = false;
				} else {
					this.rule_show = true;
				}
			},
			//搜索
			goSearch() {
				uni.navigateTo({
					url: '/pages/search/search?type=home'
				});
			},
			toFeedback(){
				uni.navigateTo({
					url:'/pages/me/feedback/feedback'
				})
			},
			//去跑腿页
			toErrand(){
				uni.navigateTo({
					url:'/pages/index/errand/errand'
				})
			}
		}
	};
</script>

<style lang="scss" scoped>
	// 页面
	page {
		// display: flex;
		background-image: url('@/static/bg1.png');
		// background: linear-gradient(180deg, rgba(255, 255, 255, 0) 71.15%, #F8F8F8 100%),
	}

	.navTag {
		display: flex;
		text-align: center;
		transition: all 0.3s ease-in-out;
		margin-top: 20rpx;
		margin-bottom: 30rpx;
		flex-direction: row;
		margin-top: 20rpx;
		// width: 100%;
		// background: #ffffff;
		white-space: nowrap;
		height: auto;
		padding: 15rpx 20rpx;
	}

	// .navTag::before {
	// 	content: '';
	// 	height: 2rpx;
	// 	width: 86vw;
	// 	background-color: #00000033;
	// 	position: absolute;
	// 	margin-top: 42rpx;
	// 	margin-left: 0vw;
	// 	z-index: 0;
	// }

	.navTags {
		box-sizing: border-box;
		display: flex;
		flex-direction: row;
		// padding: 0 14rpx 0 14rpx;
		// width: 140rpx;
		// display: inline-block;
		white-space: nowrap;

		.checked {
			font-weight: 700;
			background: linear-gradient(360deg, #B9EBDD 0%, rgba(219, 249, 241, 0) 100%);
		}
	}

	.navTag-text {
		width: 14vw;
		font-size: 30rpx;
		text-align: center;
		color: #ababab;
		transition: all 0.2s ease-in-out;
	}

	.navTag-select {
		content: '';
		width: 16vw;
		height: 2rpx;
		// display: inline-block;
		margin-top: 14rpx;
		// margin-left: -30rpx;
		// position: absolute;
		z-index: 999;
		transition: all 0.3s ease-in-out;
	}

	.imgXiao_box {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: flex-start;

		image {
			width: 100px;
			height: 100px;
		}
	}

	.search_box {
		margin-top: 40rpx;
		display: flex;
		justify-content: flex-start;
		align-items: center;

		image {
			width: 60rpx;
			height: 60rpx;
		}
	}

	.function_box {
		margin-bottom: 10rpx;
		display: flex;
		justify-content: space-around;
		// border: 4rpx solid #FFFFFF;
	}

	.function_item {
		width: 100rpx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;

		.titile {
			margin-top: 10rpx;
			font-size: 27rpx;
			font-weight: bold;
		}
	}

	.coupon-tip {
		align-items: center;
		margin-left: 10rpx;
		padding: 3upx 5upx;
		background: #ff5722;
		font-size: 10rpx;
		color: #fff;
		border-radius: 6rpx;
		line-height: 1;
		transform: translateY(-4upx);
	}

	/* 内容布局 start*/
	.course-shadow {
		box-shadow: 0rpx 0rpx 80rpx 0rpx rgba(0, 0, 0, 0.07);
	}

	.course-radius {
		border-radius: 15rpx;
	}

	/* 图标容器15 start */
	.icon15 {
		&__item {
			width: 30%;
			background-color: #ffffff;
			border-radius: 10rpx;
			padding: 30rpx;
			margin: 20rpx 10rpx;
			transform: scale(1);
			transition: transform 0.3s linear;
			transform-origin: center center;

			&--icon {
				width: 100rpx;
				height: 100rpx;
				font-size: 60rpx;
				border-radius: 50%;
				margin-bottom: 18rpx;
				position: relative;
				z-index: 1;

				&::after {
					content: ' ';
					position: absolute;
					z-index: -1;
					width: 100%;
					height: 100%;
					left: 0;
					bottom: 0;
					border-radius: inherit;
					opacity: 1;
					transform: scale(1, 1);
					background-size: 100% 100%;
				}
			}
		}
	}

	@keyframes suspension {

		0%,
		100% {
			transform: translate(0, 0);
		}

		50% {
			transform: translate(-0.8rem, 1rem);
		}
	}

	.login {
		position: relative;
		height: 100%;
		z-index: 1;
		background-color: #ffa473;

		/* 背景图片 start */
		&__bg {
			z-index: -1;
			position: fixed;
			background-color: #ffa473;

			&--top {
				top: 0;
				left: 0;
				right: 0;
				width: 100%;

				.bg {
					width: 750rpx;
					will-change: transform;
				}

				.rocket {
					margin: 50rpx 28%;
					width: 400rpx;
					will-change: transform;
				}
			}

			&--bottom {
				bottom: -10rpx;
				left: 0;
				right: 0;
				width: 100%;
				// height: 288rpx;
				margin-bottom: env(safe-area-inset-bottom);

				image {
					width: 750rpx;
					will-change: transform;
				}
			}
		}

		/* 背景图片 end */

		/* 内容 start */
		&__wrapper {
			margin-top: 403rpx;
			width: 100%;
			background-color: #ffa473;
		}

		/* 切换 start */
		&__mode {
			position: relative;
			background-color: #ffa473;
			margin: 0 auto;
			width: 600rpx;
			height: 77rpx;
			background-color: #ffffff;
			box-shadow: 0rpx 10rpx 50rpx 0rpx rgba(0, 3, 72, 0.1);
			border-radius: 39rpx;

			&__item {
				height: 77rpx;
				width: 100%;
				line-height: 77rpx;
				text-align: center;
				font-size: 31rpx;
				color: #908f8f;
				letter-spacing: 0.5em;
				text-indent: 1em;
				z-index: 2;
				transition: all 0.4s;

				&--active {
					font-weight: bold;
					color: #ffffff;
				}
			}

			&__slider {
				position: absolute;
				height: inherit;
				width: calc(600rpx / 2);
				border-radius: inherit;
				box-shadow: 0rpx 18rpx 72rpx 18rpx rgba(0, 195, 255, 0.1);
				z-index: 1;
				transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
			}
		}

		/* 切换 end */

		/* 登录方式切换 start */
		&__way {
			margin: 0 auto;
			margin-top: 110rpx;
			background-color: #ffa473;

			&__item {
				&--icon {
					width: 77rpx;
					height: 77rpx;
					font-size: 50rpx;
					border-radius: 100rpx;
					margin-bottom: 18rpx;
					position: relative;
					z-index: 1;

					&::after {
						content: ' ';
						position: absolute;
						z-index: -1;
						width: 100%;
						height: 100%;
						left: 0;
						bottom: 0;
						border-radius: inherit;
						opacity: 1;
						transform: scale(1, 1);
						background-size: 100% 100%;
						background-image: url(https://tnuiimage.tnkjapp.com/cool_bg_image/icon_bg5.png);
					}
				}
			}
		}

		/* 登录方式切换 end */
		/* 内容 end */
	}

	.info_box {
		// background-color: #ffa473;
		padding-top: 10rpx;
		padding-left: 10rpx;
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}

	.introduction {
		padding-top: 10rpx;
		padding-left: 20rpx;
		padding-right: 20rpx;
		// background-color: #ffa473;
	}

	//上半部分
	.top {
		// background: linear-gradient(0deg, #ffa473, #ffe681);
		// background: linear-gradient(0deg, #FF3181, #FF8331);
	}

	// 轮播图
	.bannerimg-box {
		border-bottom-left-radius: 15upx;
		border-bottom-right-radius: 15upx;
		padding: 10rpx 20rpx;

		swiper {
			height: 305rpx;
			width: 700rpx;
		}

		.swiper-item {
			display: flex;
			justify-content: center;
			align-content: center;
			overflow: hidden;
			width: 100%;
			height: 100%;

			image {
				border-radius: 16rpx;
				width: 100%;
			}
		}
	}

	// 时间点
	.time-set {
		display: flex;
		flex-direction: row;
		margin-top: 20rpx;
		// width: 100%;
		white-space: nowrap;
		height: auto;
		padding: 0 24rpx;

		.time-set-item {
			display: flex;
			flex-direction: column;
			width: 180rpx;
			height: 106rpx;
			// line-height: 106rpx;
			margin-right: 20rpx;
			// display: inline-block;
			white-space: nowrap;
			background: linear-gradient(321.11deg, rgba(255, 72, 72, 0) 22.33%, rgba(255, 153, 0, 0.21) 96.57%), #FFFFFF;
			box-shadow: 0px 4rpx 8rpx rgba(0, 0, 0, 0.05);
			border-radius: 8rpx;
			justify-content: center;
			align-items: center;

			// background-color: #00C3FF;
			.itme-top {
				// width: 100%;
				// height: 36rpx;
				display: flex;
				padding: 0 3rpx;
				// background-color: #ff5c26;
				font-size: 28rpx;
				font-weight: 700;
				color: #FF6D4D;
				align-items: center;
				justify-content: center;
				// border-radius: 8rpx 8rpx 0 0;
			}

			.itme-blow {
				// width: 100%;
				// height: 48rpx;
				display: flex;
				// background-color: #ffffff;
				font-size: 12rpx;
				// font-weight: bold;
				color: #FF6D4D;
				align-items: center;
				justify-content: center;
				// border-radius: 0 0 10rpx 10rpx;
			}
		}
	}

	//超时赔付
	.rule {
		display: flex;
		width: 100%;
		height: auto;
		margin: 10rpx 0rpx 0 0rpx;
		padding: 0 24rpx;
		// align-items: center;
		justify-content: center;
		flex-direction: column;
		// background-color: #FFC107;
	}

	.goods-nightbox {
		width: 150rpx;
		margin-left: 15rpx;
		display: inline-block;

		.img-box {
			position: relative;
			width: 160rpx;
			height: 160rpx;
			background-color: #f1f1f1;
			border-radius: 8rpx;

			image {
				width: 160rpx;
				height: 160rpx;
			}

			.tag {
				position: absolute;
				bottom: 0;
				left: 0;
				background-color: #ff5722;
				color: #ffffff;
				padding: 4rpx 8rpx;
				font-size: 24rpx;
				border-radius: 2rpx;
			}
		}

		.tit {
			font-size: 22rpx;
			color: #a6a6a6;
			margin-top: 8rpx;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
		}

		.price-box {
			margin-top: 8rpx;

			.txt1 {
				font-size: 18rpx;
				color: #ff5722;
			}

			.txt2 {
				font-size: 24rpx;
				color: #ff5722;
			}

			.txt3 {
				margin-left: 12rpx;
				font-size: 18rpx;
				color: #bbbbbb;
				text-decoration: line-through;
			}
		}
	}

	.goods-box {
		width: 200rpx;
		margin-left: 15rpx;
		display: inline-block;

		.img-box {
			position: relative;
			width: 160rpx;
			height: 160rpx;
			background-color: #f1f1f1;
			border-radius: 8rpx;

			image {
				width: 160rpx;
				height: 160rpx;
			}

			.tag {
				position: absolute;
				bottom: 0;
				left: 0;
				background-color: #ff5722;
				color: #ffffff;
				padding: 4rpx 8rpx;
				font-size: 24rpx;
				border-radius: 2rpx;
			}
		}

		.tit {
			font-size: 22rpx;
			color: #a6a6a6;
			margin-top: 8rpx;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
		}

		.price-box {
			margin-top: 8rpx;

			.txt1 {
				font-size: 18rpx;
				color: #ff5722;
			}

			.txt2 {
				font-size: 24rpx;
				color: #ff5722;
			}

			.txt3 {
				margin-left: 12rpx;
				font-size: 18rpx;
				color: #bbbbbb;
				text-decoration: line-through;
			}
		}
	}

	// 店铺
	.store-box {

		// background-color: #ffa473;
		// background-color: #FF3181;
		.sort-box {
			display: flex;
			flex-direction: row;

			// margin-top: 24rpx;
			.item-box {
				margin-right: 32rpx;

				.tit {
					display: flex;
					justify-content: center;
					align-items: center;
					font-size: 24rpx;
					color: #333333;
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;
				}

				.active {
					font-weight: bold;
				}
			}
		}

		.mark-tag {
			padding: 2rpx 8rpx;
			font-size: 24rpx;
			border-radius: 8rpx;
			white-space: nowrap;
		}

		.item-box {
			margin: 15rpx 24rpx;
			display: flex;
			flex-direction: column;
			margin-bottom: 20rpx;
			padding-bottom: 20rpx;
			padding-top: 20rpx;
			background-color: #ffffff;
			border-radius: 16rpx;
			box-shadow: 0px 8rpx 12rpx rgba(0, 0, 0, 0.05);

			.top-box {
				display: flex;
				flex-direction: row;
				padding: 0 20rpx;

				.left {
					position: relative;
					margin-right: 20rpx;
					border-radius: 8rpx;
					overflow: hidden;
					height: 128rpx;
					width: 96rpx;

					image {
						width: 100%;
						height: 100%;
						// border-radius: 12rpx;
					}

					view {
						position: absolute;
						bottom: 0;
						width: 100%;
						height: 32rpx;
						font-size: 16rpx !important;
						line-height: 32rpx;
						text-align: center;
						background: linear-gradient(257.22deg, #FF4848 0%, #FF9900 100%);
						color: #fff;
					}
				}

				.right {
					flex: 1;

					.tit {
						font-size: 28rpx;
						font-weight: bold;
						color: #333333;
						white-space: pre-wrap;
						overflow: hidden;
						text-overflow: ellipsis;
					}

					.justify-content {
						display: flex;
						flex-direction: row;
						justify-content: space-between;
					}

					.row {
						font-size: 24rpx;
						color: #999999;
						margin-top: 8rpx;

						.mark-tag {
							width: 110rpx;
							height: 35rpx;
							display: flex;
							align-items: center;
							justify-content: center;
							font-size: 18rpx;
							color: #ff5c26;
							border-radius: 5rpx;
							white-space: nowrap;
							margin-right: 20rpx;
						}

						.row-left {
							display: flex;
							flex-direction: row;
							margin-top: 8rpx;

							.t1,
							i {
								color: #ffca3e;
							}

							text {
								position: relative;
								margin-right: 26rpx;
								font-size: 20rpx;
							}

							text:not(:last-child)::after {
								content: '';
								position: absolute;
								right: -22rpx;
								top: 8rpx;
								width: 2rpx;
								height: 16rpx;
								margin: 0 10rpx;
								background-color: #898989;

							}
						}

						.t2 {
							margin-left: 24rpx;
						}

						.row-right {
							display: flex;
							flex-direction: row;

							i {
								margin-right: 8rpx;
							}
						}
					}
				}
			}

			.goods-box:last-child {
				margin-right: 24rpx;
			}

			.bottom-box {
				&-container {
					margin: 16rpx 0 0 0;
					padding-left: 134rpx;
					white-space: nowrap;

					.goods-box {
						width: 128rpx;
						margin-right: 20rpx;
						margin-left: 0 !important;
						display: inline-block;

						.img-box {
							position: relative;
							width: 128rpx;
							height: 128rpx;
							background-color: #f1f1f1;
							border-radius: 8rpx;
							overflow: hidden;

							image {
								width: 128rpx;
								height: 128rpx;
							}

							.tit {
								position: absolute;
								font-size: 16rpx;
								bottom: 0;
								width: 100%;
								height: 30rpx;
								text-align: center;
								line-height: 30rpx;
								color: #fff;
								background-color: rgba(0, 0, 0, 0.5);
								;
							}

							.tag {
								position: absolute;
								bottom: 0;
								left: 0;
								background-color: #ff5722;
								color: #ffffff;
								padding: 4rpx 8rpx;
								font-size: 24rpx;
								border-radius: 8rpx;
							}
						}

						.tit {
							font-size: 22rpx;
							color: #a6a6a6;
							margin-top: 8rpx;
							white-space: nowrap;
							overflow: hidden;
							text-overflow: ellipsis;
						}

						.price-box {
							margin-top: 8rpx;

							.txt1 {
								font-size: 18rpx;
								color: #000;
								font-weight: 700;
							}

							.txt2 {
								font-size: 24rpx;
								color: #000;
								font-weight: 700;
							}

							.txt3 {
								margin-left: 8rpx;
								font-size: 14rpx;
								color: #bbbbbb;
								text-decoration: line-through;
							}
						}
					}

					.goods-box:last-child {
						margin-right: 24rpx;
					}
				}
			}
		}

		.item-box:last-child {
			border-bottom: 0;
		}

		.rowTags {
			display: flex;
			flex-direction: row;
			margin-top: 18rpx !important;
			margin-left: 4rpx;

			view {
				border: 2rpx solid #FF6D4D;
				font-size: 16rpx;
				color: #FF6D4D;
				padding: 4rpx 6rpx;
				border-radius: 8rpx;
				margin-right: 10rpx;
				margin-left: 0 !important;
			}
		}
	}

	// 底部加载
	.bottom-more {
		width: 100%;
		height: 200rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.topBg {
		width: 100%;
		// height: 462rpx;
		position: relative;

		// overflow: hidden;
		.bg {
			// position: absolute;
			width: 100%;
		}

		.select {
			position: absolute;
			top: 56rpx;
			left: 24rpx;

			.u-mode-light-error {
				background-color: transparent !important;
				color: #fff !important;
				border: 0 !important;
				font-size: 24rpx;
				font-weight: 700;
			}

			image {
				position: absolute;
				bottom: 8rpx;
				width: 8rpx;
				height: 30rpx;
			}

			.remark {
				position: absolute;
				left: 22rpx;
				font-size: 18rpx !important;
				color: rgba(255, 255, 255, 0.8);
				white-space: nowrap;
			}

		}

		.searchBtn {
			position: absolute;
			top: 56rpx;
			// top: 0;
			right: 24rpx;
			width: 114rpx;
			height: 56rpx;
			line-height: 56rpx;
			background: linear-gradient(227.55deg, rgba(203, 241, 231, 0.7) 9.72%, rgba(255, 255, 255, 0.7) 65.69%), rgba(0, 0, 0, 0.18);
		}

		.imgs {
			position: absolute;
			// top: 0;
			bottom: 104rpx;
			left: 24rpx;
			display: flex;
			flex-direction: row;
			align-items: center;

			.img {
				width: 230rpx !important;

			}
		}
	}

	.container {
		position: relative;
		width: 100%;
		height: 100%;
		border-radius: 40rpx 40rpx 0 0;
		background-color: #F5F5F5;
		top: -140rpx;
		margin-top: 44rpx;
		overflow: hidden;
	}
</style>
